<template>
    <div id="head">
        <Logo></Logo>
        <Nav></Nav>
        <Search></Search>
        <User></User>
    </div>
</template>

<script>
import Logo from './components/logo'
import Nav from './components/nav'
import Search from './components/search'
import User from './components/user'
export default {
    components:{
        Logo,Nav,Search,User,
    }
}
</script>

<style scoped>
    #head{
        display:flex;
        flex-flow:row nowrap;
        justify-content: space-between;
        align-items: center;
        width:100%;
        height:100px;
        box-shadow: 3px 0px 5px 3px rgb(240,240,240);
    }
</style>
